<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <title>index</title>
  <script type="text/javascript" src="js/jquery.js"></script>
  <link rel="stylesheet" href="css/comon0.css">
</head>
<style>
  .fullscreenvideo {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transition: 1s opacity;
    transition: 1s opacity;
  }

  .videocontainer {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -100;
  }

  .videocontainer:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    z-index: -1;
    top: 0;
    left: 0;
    background: rgba(25, 29, 34, .65);
  }
</style>
<script>
  $(window).load(function () {
    $(".loading").fadeOut()
  })

  /****/
  $(document).ready(function () {
    var whei = $(window).width()
    $("html").css({ fontSize: whei / 20 })
    $(window).resize(function () {
      var whei = $(window).width()
      $("html").css({ fontSize: whei / 20 })
    });
  });
</script>
<!-- <script>
  var video = document.getElementById('v1');
  video.playbackRate = 0.5;
</script> -->
<script type="text/javascript" src="js/echarts.min.js"></script>
<script language="JavaScript" src="js/js.js"></script>

<body style="overflow-y: hidden;">
  <div class="canvas" style="opacity: .2">
    <iframe frameborder="0" src="js/index.html" style="width: 100%; height: 100%"></iframe>
  </div>
  <div class="loading">
    <div class="loadbox"> <img src="img/loading.gif"> 页面加载中... </div>
  </div>
  <div class="head">
    <h1>監控系統綜合面板</h1>
    <div class="weather">
      <!--<img src="picture/weather.png"><span>多云转小雨</span>-->
      <!-- 顶部时间模块 -->
      <span id="showTime"></span>
    </div>
    <script>
      var t = null;
      t = setTimeout(time, 1000);//開始运行
      function time() {
        clearTimeout(t);//清除定时器
        dt = new Date();
        var y = dt.getFullYear();
        var mt = dt.getMonth() + 1;
        var day = dt.getDate();
        var h = dt.getHours();//获取时
        var m = dt.getMinutes();//获取分
        var s = dt.getSeconds();//获取秒
        document.getElementById("showTime").innerHTML = y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" + s + "秒";
        t = setTimeout(time, 1000); //设定定时器，循环运行     
      }
    </script>
  </div>

  <div class="mainbox ">
    <ul class="clearfix">
      <!-- 左侧部分 -->
      <li class="main_left clearfix">
        <div class="boxall" style="height: 3.2rem">
          <div class="alltitle">模块01</div>
          <div class="allnav" id="echart1"></div>
          <div class="boxfoot"></div>
        </div>
        <div class="boxall" style="height: 3.2rem">
          <div class="alltitle">模块02</div>
          <div class="allnav" id="echart2"></div>
          <div class="boxfoot"></div>
        </div>
        <div class="boxall" style="height: 3.2rem">
          <div style="height:100%; width: 100%;">
            <div class="sy" id="fb1"></div>
            <div class="sy" id="fb2"></div>
            <div class="sy" id="fb3"></div>
          </div>
          <div class="boxfoot">
          </div>
        </div>
      </li>
      <!-- 中间内容区 -->
      <li class="main_center clearfix" style="overflow: hidden;">
        <div class="bar">
          <div class="barbox">
            <ul class="clearfix">
              <li class="pulll_left counter">12582</li>
              <li class="pulll_left counter">18793</li>
            </ul>
          </div>
          <div class="barbox2">
            <ul class="clearfix">
              <li class="pulll_left">2019年高清监控数量 </li>
              <li class="pulll_left">2019年模拟监控数量</li>
            </ul>
          </div>
        </div>
      <div class="bb" style="margin-top: 3rem;"></div>
      <!-- 中間底部部分 -->
        <div class="boxall main_center_bottom" style="height: 3.2rem;overflow: hidden;margin-top: 5.111rem;">
          
          <div class="boxfoot">
          </div>
        </div>
        <div class="boxall main_center_bottom" style="height: 3.2rem;overflow: hidden;margin-top: 5.11rem; margin-left: 1%;">
          <iframe src="./cn/demo.html" frameborder="0" scrolling="No" style="width: 100%; height: 100%;"></iframe>
          <div class="boxfoot">
          </div>
        </div>
        <div class="map1 videocontainer"><video class="fullscreenvideo" poster=""
          id="bgvid" playsinline="" autoplay="" muted="" loop="">
          <source src="images/test_mv02.mov" type="video/mp4">
        </video></div>
        <!--<div class="map">
           <div class="map1"><img src="picture/lbx.png"></div>
          <div class="map2"><img src="picture/jt.png"></div>
          <div class="map3"><img src="picture/map.png"></div>
           <div class="map1 videocontainer"><video class="fullscreenvideo" poster=""
              id="bgvid" playsinline="" autoplay="" muted="" loop="">
              <source src="images/test_mv02.mov" type="video/mp4">
            </video></div>
         <div class="map4" id="map_1"></div>  
        </div>-->
      </li>
      <!-- 右侧部分 -->
      <li class="main_right">
        <div class="boxall" style="height:3.4rem">
          <div class="alltitle">模块→01</div>
          <div class="allnav" id="echart4"></div>
          <div class="boxfoot"></div>
        </div>
        <div class="boxall" style="height: 3.2rem">
          <div class="alltitle">模块→02</div>
          <div class="allnav" id="echart5"></div>
          <div class="boxfoot"></div>
        </div>
        <div class="boxall" style="height: 3rem">
          <div class="alltitle">模块→03</div>
          <div class="allnav" id="echart6"></div>
          <div class="boxfoot"></div>
        </div>
      </li>
    </ul>
  </div>
  <div class="back"></div>


  <script type="text/javascript" src="js/china.js"></script>
  <script type="text/javascript" src="js/area_echarts.js"></script>
</body>

</html>